<script setup>
//  引入naive-ui
import {NPopover, NButton, NScrollbar} from "naive-ui";

const {error, data} = await useCouponListApi();

console.log(data.value)
</script>

<template>
  <ClientOnly>
    <n-popover trigger="click" :width="450" placement="right">
      <template #trigger>
        <n-button strong secondary type="warning" size="tiny">领取优惠价</n-button>
      </template>
      <div class="p-2">
        <h4 class="text-lg font-bold mb-3">可用优惠卷({{ data.length }})</h4>
        <NScrollbar style="height: 300px;">
          <CouponList v-for="(item,index) in data" :key="index" :item="item"/>
        </NScrollbar>
      </div>
    </n-popover>
  </ClientOnly>
</template>

<style scoped>

</style>